<template>
	<view class="content">
		<!-- <view class="head">
			<view class="head_search">
				<view class="search_view">
					<input class="search" v-model="keyword" placeholder="请输入关键字搜索" ></input>
					<image src="http://113.142.144.25:9301/statics/appimg/icon_search_btn_new.png" 
					style="height: 30rpx;width:30rpx;padding: 20rpx;" @click="searchPolicy()"></image>
				</view>
			</view>
		</view> -->
		<!-- 		<view style="position: fixed;top: 80%;left: 75%; z-index: 999;">
			<image style="height: 60rpx;width: 60rpx;" src="../../../static/images/icon_publish.png"></image>
		</view> -->
		<u-list @scrolltolower="scrolltolower">
			<view>
				<image style="height: 200rpx; width: 100%" src="../../../static/images/icon_publish.png" @click="publish()"></image>
			</view>
			<!-- <view style="background-color: white; height: 400rpx; margin-top: 35rpx">
				<view style="text-align: center; padding: 15rpx">即将开始</view>
				<view class="video_item" style="width: 90%" v-if="item.publishTime >= timeNow" v-for="(item, index) in videoList" :key="index" @click="videoDetail(videoList[index])">
					<image class="video_img" :src="item.coverImage"></image>
					<view class="video_content">
						<view>
							<text class="video_title">{{ item.title }}</text>
							<text class="publicTime">路演时间：{{ item.publishTime }}</text>
						</view>
					</view>
					<view class="devideline"></view>
				</view>
			</view> -->
			<view style="text-align: center; padding: 25rpx; margin-top: 20rpx">精彩回放</view>
			<view class="list">
				<u-list-item v-for="(item, index) in videoList" :key="index" @click="videoDetail(videoList[index])">
					<image class="video_img" :src="item.coverImage"></image>
					<view class="video_content">
						<view>
							<text class="video_title">{{ item.title }}</text>
							<text class="publicTime">路演时间：{{ item.publishTime }}</text>
						</view>
						<!-- 	<view>
								<text class="video_publisher">举办单位：{{item.createBy}}</text>
							</view> -->
						<!-- <view>
								<text class="publicTime">路演时间：{{item.publishTime}}</text>
							</view> -->
					</view>
				</u-list-item>
			</view>
			<!-- <view class="video_item" v-for="(item, index) in videoList" :key="index" @click="videoDetail(videoList[index])">
				<image class="video_img" :src="item.coverImage"></image>
				<view class="video_content">
					<view>
						<text class="video_title">{{ item.title }}</text>
						<text class="publicTime">路演时间：{{ item.publishTime }}</text>
					</view> -->
			<!-- 	<view>
						<text class="video_publisher">举办单位：{{item.createBy}}</text>
					</view> -->
			<!-- <view>
						<text class="publicTime">路演时间：{{item.publishTime}}</text>
					</view> -->
			<!-- </view>
				<view class="devideline"></view>
			</view> -->
		</u-list>
	</view>
</template>

<script>
function show() {
	var now = new Date();
	var year = now.getFullYear(); //得到年份
	var month = now.getMonth() + 1; //得到月份
	var date = now.getDate(); //得到日期
	// var day = now.getDay();//得到周几
	this.timeNow = year + '-' + month + '-' + day;
}

import env from '../../../utils/env';
import * as video from '@/api/video';
export default {
	data() {
		return {
			title: '',
			videoList: [],
			query: {
				pageNum: 1,
				pageSize: 10
			},
			total: 0,
			timeNow: Date.now()
		};
	},
	onLoad() {
		this.getVideo();
	},
	methods: {
		morevideo() {
			uni.navigateTo({
				url: '/subpages/pages/video/videoList'
			});
		},
		// 更新order
		updateOrderInfo(index) {
			let _this = this;
			this.pageNum = 1;
			this.videoList = [];
			_this.getVideo();
		},
		// 滑到底部 加载更多
		scrolltolower() {
			if (this.videoList.length < this.total) {
				this.query.pageNum = this.query.pageNum + 1;
				this.getVideo();
			} else {
				uni.showToast({
					icon: 'none',
					title: '暂无更多数据！'
				});
			}
		},
		getVideo() {
			console.log(this.timeNow);
			video.getVideo(this.query).then((res) => {
				res.rows.forEach((v) => {
					v.coverImage = `${env.imgUrl}` + v.coverImage;
					this.videoList.push(v);
				});
				this.total = res.total;
			});
		},
		videoDetail(item) {
			uni.navigateTo({
				url: '/subpages/pages/detail/video_detail?id=' + item.id
			});
		},
		publish() {}
	}
};
</script>

<style scoped>
.list {
	display: grid;
	justify-content: space-around;
	grid-template-columns: repeat(auto-fill, 48%);
}
::v-deep .u-list-item {
	border-bottom: 2rpx solid #ccc;
	margin-bottom: 20rpx;
	padding-bottom: 10rpx;
}
.content {
	width: 100%;
	height: 100%;
	margin: 0 auto;
	background: #e6e6e6;
}

.head {
	width: 100%;
	height: 120rpx;
	background-color: #016fb8;
	padding-top: 40rpx;
}

.head_search {
	display: flex;
	width: 90vw;
	margin: 20rpx auto;
	height: 70rpx;
	border-radius: 30rpx;
	background-color: #fff;
	text-align: center;
}

.search_view {
	margin: 0 auto;
}

.search {
	height: 40rpx;
	padding-top: 15rpx;
	font-size: 25rpx;
	float: left;
}

.video_list {
	width: 100%;
	height: 100%;
	margin: 30rpx auto;
	background-color: #fff;
}

.video_item {
	padding: 20rpx;
	width: 43%;
	margin-left: 1%;
	float: left;
}

.devideline {
	float: left;
	height: 0.3rpx;
	width: 100%;
	background-color: #eeeeee;
	margin-top: 25rpx;
	margin-bottom: 25rpx;
}

.video_img {
	height: 320rpx;
	width: 100%;
	float: left;
	border-radius: 30rpx;
}

.video_content {
	width: 100%;
	float: right;
	margin-top: 15rpx;
}

.video_title {
	display: -webkit-box;
	width: 90%;
	float: left;
	font-size: 28rpx;
	margin-top: 15rpx;
	margin-left: 15rpx;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	/*排列方式*/
	-webkit-line-clamp: 1;
	/*显示文本行数(这里控制多少行隐藏)*/
}

.video_publisher {
	display: flex;
	font-size: 25rpx;
	padding_top: 15rpx;
}

.publicTime {
	width: 90%;
	font-size: 25rpx;
	/* 	color: #a1a1a1; */
	margin-top: 15rpx;
	float: left;
	margin-left: 15rpx;
}
</style>
